import { defineStore } from 'pinia'

import { CommodityList } from '../api/list'
import { CommodityDetails } from '../api/productApi'
import { cartAdd } from '../api/cart'
import {userInfo} from '../api/home'

type State = {
    productList: Product[],
    count: number,
    flag: boolean,
    cpData: Product,
    cpImg:string[],
    userid:string|null,
    homeScrollTop:number
}

// 命名以 use 开头
// 用法 defineStore(名称, 对象)
export const useProductStore = defineStore(
    'product-store', // store 名称, 要求唯一
    {
        // 为了更好的支持 ts, state 最好写成箭头函数
        // 相当于 vue 的 data
        state: (): State => {
            return {
                // 数据
                productList: [],
                // 页码
                count: 1,
                // 开关
                flag: false,
                // 商品详情数据
                cpData: {} as Product,
                cpImg:[],
                userid:localStorage.getItem('userid'),
                homeScrollTop:0
            }
        },
        // 相当于 vue 的 computed
        getters: {

        },
        // 相当于vue的methods
        actions: {
            // 获取商品的列表
            async fetchList() {
                
                const result = await CommodityList(this.count)
                // console.log(this.count);

                // 接口的数据 赋值给 state
                this.productList = [...this.productList, ...result.data]
                if (result.data.length === 0) {
                    this.flag = true
                }
            },
            // 获取商品详情
            async fetchProduct(proid: string) {
                // 在本地去商品详情不走请求
                // 根据 proid 从产品列表里找出 对应的产品详情数据
                const product = await this.productList.find(item => item.proid === proid)
                if (product) {
                    // 如果 能找到 直接返回数据
                    console.log('没法请');
                    this.cpData = product
                    this.pushImg(product)
                } else {
                    console.log('发了');
                    // pinia 里找不到 发请求
                    let res = await this.requestProduct(proid)
                    this.cpData = res
                    this.pushImg(res)
                }
            },
            async requestProduct(proid: string) {
                // 本地找不到的时候
                const result = await CommodityDetails(proid)
                return result.data
            },
            // 添加商品到购物车
            async cartACC(){
                // 只要进入了详情页就一个能取到id
                const result = await cartAdd(this.userid! , this.cpData.proid)
                return result
            },
            // 获取用户信息
            async feachUserid(){
                const result = await userInfo(this.userid!)
            },
            // 单个商品的详情图片
            pushImg(product:Product){
                this.cpImg = []
                this.cpImg.push(product.img1)
                this.cpImg.push(product.img2)
                this.cpImg.push(product.img3)
                this.cpImg.push(product.img4)
            }
        }
    }
)